<template>
  <div class="admin">
    <Loading v-show="loading"></Loading>
    <Nav></Nav>
    <h2 class="title m-b-5">
      <a :href="'tel:' + phone" class="phone">访客电话：{{phone}}</a>
    </h2>
    <p class="fl fl-space-center m-b-10">
      访问时间：{{time}}
    </p>
    <Fee :statistics="statistics"></Fee>
    <h2 class="title">
      能源云计算
    </h2>
    <Chart :unitFee="highFee" :totalFee="total_fee" :loadData="load_data" :profit="profit" :esShow="esShow"></Chart>
    <div class="stick-footer">
      <Footer></Footer>
    </div>
  </div>
</template>

<script>
import Nav from '../components/Nav'
import Footer from '../components/Footer'
import Fee from '../components/FeeStatistic'
import Chart from '../components/FeeTabChart'
import Loading from '../components/loading'

export default {
  name: 'Admin',
  data () {
    return {
      loading: true,
      statistics: {},
      load_data: [],
      total_fee: [],
      profit: [],
      esShow: 0,
      phone: '',
      time: ''
    }
  },
  mounted () {
    this.loadDatas()
  },
  components: {
    Nav,
    Footer,
    Fee,
    Chart,
    Loading
  },
  methods: {
    loadDatas () {
      const id = this.$route.params.id
      const key = this.$route.params.key
      const url = '/review_es_data?id=' + id + '&key=' + key
      this.$http.get(url).then(res => {
        this.loading = false
        if (res.status === 200) {
          const response = res.data
          if (response.status === 1) {
            const data = response.data
            this.statistics = data.statistics
            this.load_data = data.load_data
            this.total_fee = data.total_fee
            this.profit = data.profit
            this.esShow = data.es_show
            this.phone = data.user.phone
            this.time = data.user.time
          }
        } else {
          alert('数据未找到')
        }
      })
    }
  },
  computed: {
    highFee () {
      if ('summer' in this.statistics) {
        return this.statistics.summer[0].fee
      }
      return 0
    }
  }
}
</script>

<style scoped>
  h2.title {
    text-align: center;
    margin-bottom: 18px;
    margin-top: 18px;
    font-size: 20px;
  }
  .light {
    font-weight: normal;
    font-size: 12px;
  }
</style>
